package com.feeyo.groundservice.composewidget.usage

import android.os.Bundle
import androidx.activity.compose.setContent
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.gestures.Orientation
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.material3.Button
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateListOf
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.unit.dp
import com.feeyo.groundservice.composewidget.R
import com.feeyo.groundservice.composewidget.usage.base.BaseComposeActivity
import com.feeyo.groundservice.composewidget.util.rememberMutableStateOf
import com.feeyo.groundservice.base_util.toast
import com.feeyo.groundservice.composewidget.view.flow_layout.FlowLayout
import com.feeyo.groundservice.composewidget.view.flow_layout.LabelsFlowLayout
import com.feeyo.groundservice.composewidget.view.image.CustomAsyncImage
import com.feeyo.groundservice.composewidget.view.util.SelectMode

/**
 *作者：QLH on 2023-08-08
 *描述：
 */
class FlowLayoutActivity : BaseComposeActivity() {

    private val items = mutableStateListOf(
        "0",
        "1111111111",
        "22222",
        "333333333333333333333333",
        "Image",
        "44444444444",
        "5555555\n5555",
        "666",
        "77777777777777777777777777777777777777777777",
    )

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            Column {
                Text("单纯的流式布局")
                FlowLayoutSimple()
                Text("单纯的流式布局之单选")
                LabelsFlowLayoutSampleOfRadio()
                Text("单纯的流式布局之多选")
                LabelsFlowLayoutSampleOfMultipleChoiceMax()
                Text("单纯的流式布局之多选，最多3个")
                LabelsFlowLayoutSampleOfMultipleChoice3()
            }
        }
    }

    //单纯的标签展示
    @Composable
    fun FlowLayoutSimple() {
        FlowLayout(
            modifier = Modifier.fillMaxWidth().background(Color.Gray).padding(10.dp),
            orientation = Orientation.Horizontal,
            horizontalMargin = 10.dp,
            verticalMargin = 10.dp,
            maxLines = 8
        ) {
            items.forEach {
                if (it == "Image") {
                    CustomAsyncImage(
                        model = R.drawable.icon_placeholder_loading,
                        contentDescription = null,
                        modifier = Modifier.size(30.dp),
                        contentScale = ContentScale.FillBounds
                    )
                } else {
                    Text(text = it)
                }
            }
        }
    }

    //单选
    @Composable
    private fun LabelsFlowLayoutSampleOfRadio() {
        var selectMode = rememberMutableStateOf<SelectMode>(value = SelectMode.Radio)
        LabelsFlowLayout(
            size = 10,
            selectMode = selectMode.value,
            horizontalMargin = 5.dp,
            verticalMargin = 0.dp
        ) {
            Button(
                onClick = {
                    //设置单选无法取消(也可以不加这个限制)
                    if (selectMode.value == SelectMode.Radio) {
                        setIsSelect(true) {}
                        return@Button
                    }
                    setIsSelect(!getIsSelect()) {
                        toast("超过选择上限了")
                    }
                },
                colors = ButtonDefaults.buttonColors(

                    containerColor = if (getIsSelect()) Color.Yellow else MaterialTheme.colorScheme.primary
                )
            ) {
                Text("$index")
            }
        }
    }

    //多选
    @Composable
    private fun LabelsFlowLayoutSampleOfMultipleChoiceMax() {
        var selectMode = rememberMutableStateOf<SelectMode>(value = SelectMode.MultipleChoice())
        LabelsFlowLayout(
            size = 10,
            selectMode = selectMode.value,
            horizontalMargin = 5.dp,
            verticalMargin = 5.dp
        ) {
            Button(
                onClick = {
                    //设置单选无法取消(也可以不加这个限制)
                    if (selectMode.value == SelectMode.Radio) {
                        setIsSelect(true) {}
                        return@Button
                    }
                    setIsSelect(!getIsSelect()) {
                        toast("超过选择上限了")
                    }
                },
                colors = ButtonDefaults.buttonColors(
                    containerColor = if (getIsSelect()) Color.Yellow else MaterialTheme.colorScheme.primary
                )
            ) {
                Text("$index")
            }
        }
    }

    //多选3个
    @Composable
    private fun LabelsFlowLayoutSampleOfMultipleChoice3() {
        var selectMode = rememberMutableStateOf<SelectMode>(value = SelectMode.MultipleChoice(3))
        LabelsFlowLayout(
            size = 10,
            selectMode = selectMode.value,
            horizontalMargin = 10.dp,
            verticalMargin = 10.dp
        ) {

            Text(
                "$index",
                modifier = Modifier.background(
                    color = if (getIsSelect()) Color.Yellow else MaterialTheme.colorScheme.primary
                ).padding(vertical = 10.dp, horizontal = 30.dp)
                    .clickable {
                        //设置单选无法取消(也可以不加这个限制)
                        if (selectMode.value == SelectMode.Radio) {
                            setIsSelect(true) {}
                            return@clickable
                        }
                        setIsSelect(!getIsSelect()) {
                            toast("超过选择上限了")
                        }
                    }
            )
        }
    }

}